<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>demo</title>
	<style>
		* {
			margin: 0;
			padding: 0;
			font-size: 14px;
			outline: none;
		}
		html, body {
			height: 100%;
		}
		.box {
			padding: 20px;
			height: calc(100% - 40px);
		}
		.lDiv {
			width: 200px;
			height: 100%;
			float: left;
			background-color: #ccc;
		}
		.rDiv {
			margin-left: 220px;
			padding: 20px;
			min-height: calc(100% - 40px);
			background-color: #ccc;
		}
		.btnBox {
			width: 800px;
			margin: 0 auto 20px;
		}
		.btn {
			margin-right: 5px;
			padding: 5px 15px;
			border-radius: 3px;
			border: none;
			cursor: pointer;
			background-color: #f5f5f5;
		}
		.btn:hover {
			background-color: #fff;
		}
		.btn.active {
			color: #fff;
			background-color: #38b53d;
		}
		.table {
			width: 800px;
			border-radius: 3px;
			overflow: hidden;
			margin: 0 auto;
			border-collapse: collapse;
		}
		.table thead {
			background-color: #cde8f3;
		}
		.table th {
			color: #333;
		}
		.table th,
		.table td {
			height: 40px;
			line-height: 40px;
		}
		.table th:first-child,
		.table td:first-child {
			width: 50px;
			text-align: center;
		}
		.table td {
			background-color: #fff;
			border-bottom: 1px solid #ccc;
		}
		.table tbody tr:hover td {
			background-color: #f5f5f5;
		}
	</style>
</head>
<body>
	<div class="box">
		<div class="lDiv"></div>
		<div class="rDiv">
			<div class="btnBox">
				<button class="btn active">新增</button>
				<button class="btn">编辑</button>
				<button class="btn">审核</button>
			</div>
			<table class="table">
				<thead>
					<tr>
						<th>
							<input type="checkbox"></th>
						<th>字段一</th>
						<th>字段二</th>
						<th>字段三</th>
					</tr>
				</thead>
				<tbody>
					<tr>
						<td>
							<input type="checkbox">
						</td>
						<td></td>
						<td></td>
						<td></td>
					</tr>
					<tr>
						<td>
							<input type="checkbox">
						</td>
						<td></td>
						<td></td>
						<td></td>
					</tr>
					<tr>
						<td>
							<input type="checkbox">
						</td>
						<td></td>
						<td></td>
						<td></td>
					</tr>
				</tbody>
			</table>
		</div>
	</div>
</body>
</html>